<template>
  <el-container>
    <!-- 主容器 -->
    <body>
    <div id="base">
      <el-header>
        <!-- 顶栏 (动态面板) -->
        <div id="u111" class="ax_default" data-label="顶栏" style="left: -73px; width: 1467px;">
          <div id="u111_state0" class="panel_state" data-label="State1" style="width: 1467px;">
            <div id="u111_state0_content" class="panel_state_content" style="margin-left: 73px;">

              <!-- Unnamed (矩形) -->
              <div id="u112" class="ax_default label" style="cursor: pointer;">
                <div id="u112_div" class="" tabindex="0"></div>
                <div id="u112_text" class="text ">

                  <p>
                    <el-link @click="handleClickToHome()" type="info" :underline="false">鲜花网首页</el-link>
                  </p>

                </div>
              </div>

              <!-- Unnamed (矩形) -->
              <div id="u113" class="ax_default label" style="cursor: pointer;">
                <div id="u113_div" class="" tabindex="0"></div>
                <div id="u113_text" class="text ">
                  <el-col :span="22">
                    <el-dropdown>
                                  <span class="el-dropdown-link">
                                    <el-link @click="handleClickToCenter()" type="info"
                                             :underline="false">个人中心</el-link>
                                  </span>
                      <el-dropdown-menu>
                        <el-dropdown-item>
                          <el-link @click="handleClickToEvaluate()" type="info">评价管理</el-link>
                        </el-dropdown-item>
                        <el-dropdown-item>
                          <el-link @click="handleClickToPIM()" type="info">个人信息</el-link>
                        </el-dropdown-item>
                        <el-dropdown-item>
                          <el-link @click="handleClickSite()" type="info">收货地址</el-link>
                        </el-dropdown-item>
                      </el-dropdown-menu>
                    </el-dropdown>
                  </el-col>
                </div>
              </div>

              <!-- Unnamed (矩形) -->
              <div id="u114" class="ax_default label" style="cursor: pointer;" v-if="this.accountId!=null" @click="toCart">
                <div id="u114_div" class="" tabindex="0"></div>
                <div id="u114_text" class="text ">
                  <p><span>购物车 ({{ this.cartCount }})</span></p>
                </div>
              </div>
              <div id="u114" class="ax_default label" style="cursor: pointer;" v-else>
                <div id="u114_div" class="" tabindex="0"></div>
                <div id="u114_text" class="text ">
                  <p><span>请先登录</span></p>
                </div>
              </div>

              <!-- Unnamed (形状) -->
              <div id="u115" class="ax_default _形状1">
                <img id="u115_img" class="img " src="@/components/css/images/home/u115.svg">
                <div id="u115_text" class="text " style="display:none; visibility: hidden">
                  <p></p>
                </div>
              </div>

              <!-- Unnamed (矩形) -->
              <div id="u116" class="ax_default label">
                <div id="u116_div" class=""></div>
                <div id="u116_text" class="text ">
                  <p><span>鲜花网，订花行业优质平台！</span></p>
                </div>
              </div>

              <!-- Unnamed (垂直线) -->
              <div id="u117" class="ax_default line">
                <img id="u117_img" class="img " src="@/components/css/images/home/u117.svg">
                <div id="u117_text" class="text " style="display:none; visibility: hidden">
                  <p></p>
                </div>
              </div>

              <!-- Unnamed (组合) -->
              <div id="u118" class="ax_default" data-left="1140" data-top="5" data-width="65" data-height="20"
                   style="cursor: pointer;">

                <!-- Unnamed (矩形) -->
                <div id="u119" class="ax_default label">
                  <div id="u119_div" class="" tabindex="0"></div>
                  <div id="u119_text" class="text ">
                    <p id="cache4" style=""><span id="cache5" style="" @click="toOrder()">我的订单</span></p>
                  </div>
                </div>

                <!-- Unnamed (形状) -->
                <div id="u120" class="ax_default _形状1">
                  <img id="u120_img" class="img" src="@/components/css/images/home/u120.svg">
                  <div id="u120_text" class="text " style="display:none; visibility: hidden">
                    <p id="cache6" style=""></p>
                  </div>
                </div>
              </div>

              <!-- Unnamed (组合) -->
              <div id="u121" class="ax_default" data-left="1254" data-top="5" data-width="67" data-height="20"
                   style="cursor: pointer;">

                <!-- Unnamed (矩形) -->
                <div id="u122" class="ax_default label">
                  <div id="u122_div" class="" tabindex="0"></div>
                  <div id="u122_text" class="text ">
                    <p id="cache1" style=""><span id="cache2" style="">商户后台</span></p>
                  </div>
                </div>

                <!-- Unnamed (形状) -->
                <div id="u123" class="ax_default _形状">
                  <img id="u123_img" class="img" src="@/components/css/images/home/u123.svg">
                  <div id="u123_text" class="text " style="display:none; visibility: hidden">
                    <p id="cache3" style=""></p>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>

        <!-- Unnamed (组合) -->
        <div id="u124" class="ax_default" data-left="0" data-top="50" data-width="118" data-height="60"
             style="cursor: pointer;">

          <!-- Unnamed (矩形) -->
          <div id="u125" class="ax_default _三级标题">
            <div id="u125_div" tabindex="0"></div>
            <div id="u125_text" class="text ">
              <p><span>鲜 花 网</span></p>
            </div>
          </div>

          <!-- Unnamed (矩形) -->
          <div id="u126" class="ax_default label">
            <div id="u126_div" class=""></div>
            <div id="u126_text" class="text ">
              <p><span>Xianhuawang.com</span></p>
            </div>
          </div>
        </div>

        <!-- Unnamed (矩形) -->
        <div id="u135" class="ax_default label">
          <div id="u135_div" class=""></div>
          <div id="u135_text" class="text ">
            <p><span>提供市内送花到手服务，表白快人一步！</span></p>
          </div>
        </div>

        <!-- Unnamed (文本框) -->
        <div id="u136" class="ax_default text_field">
          <div id="u136_div"></div>
          <el-input
              id="u136_input"
              type="text"
              class="u136_input"
              placeholder="点击搜索关键字"
              v-model="searchToName"
              style="color: rgb(153, 153, 153);"
          />
        </div>

        <!-- Unnamed (矩形) -->
        <div id="u137" class="ax_default primary_button" style="cursor: pointer;">
          <div id="u137_div" class="" tabindex="0"></div>
          <div id="u137_text" class="text ">
            <p><span><el-link @click="handleClickToProduct()" type="info" :underline="false">搜索</el-link></span></p>
          </div>
        </div>

        Unnamed (形状)
        <div id="u138" class="ax_default _形状">
          <img id="u138_img" class="img " src="@/components/css/images/home/u138.svg">
          <div id="u138_text" class="text " style="display:none; visibility: hidden">
            <p></p>
          </div>
        </div>

        <!-- Unnamed (矩形) -->
        <div id="u290" class="ax_default label">
          <div id="u290_div" class=""></div>
          <div id="u290_text" class="text ">
            <p><span>400-123-4xxx</span></p>
          </div>
        </div>

        <!-- Unnamed (形状) -->
        <div id="u291" class="ax_default _形状">
          <img id="u291_img" class="img " src="@/components/css/images/home/u291.svg">
          <div id="u291_text" class="text " style="display:none; visibility: hidden">
            <p></p>
          </div>
        </div>

      </el-header>

      <router-view/>

      <el-footer>
<!--                <div id="footer" style="">-->
        <div id="u217" class="ax_default" data-label="底栏" style="left: -73px; width: 1467px;">
          <div id="u217_state0" class="panel_state" data-label="State1" style="width: 1467px;">
            <div id="u217_state0_content" class="panel_state_content" style="margin-left: 73px;">

              <!-- Unnamed (矩形) -->
              <div id="u218" class="ax_default _文本段落">
                <div id="u218_div" class=""></div>
                <div id="u218_text" class="text ">
                  <p><span>© 2020-2099&nbsp; xianhuawang.com All Rights Reserved</span></p>
                  <p><span>违法和不良信息举报电话：12377</span></p>
                  <p><span>粤公网安备 23012345000xxx号</span></p>
                  <p><span>粤ICP备230012xxx号 -1</span></p>
                </div>
              </div>

              <!-- Unnamed (矩形) -->
              <div id="u219" class="ax_default _文本段落">
                <div id="u219_div" class=""></div>
                <div id="u219_text" class="text ">
                  <p><span>全国服务热线</span></p>
                  <p><span>400-123-4xxx</span></p>
                  <p><span>服务时间：9:00-21:00</span></p>
                </div>
              </div>

              <!-- Unnamed (图片 ) -->
              <div id="u220" class="ax_default image">
                <img id="u220_img" class="img " src="@/components/css/images/home/u220.png">
                <div id="u220_text" class="text " style="display:none; visibility: hidden">
                  <p></p>
                </div>
              </div>

              <!-- Unnamed (垂直线) -->
              <div id="u221" class="ax_default line">
                <img id="u221_img" class="img " src="@/components/css/images/home/u221.svg">
                <div id="u221_text" class="text " style="display:none; visibility: hidden">
                  <p></p>
                </div>
              </div>

              <!-- Unnamed (矩形) -->
              <div id="u222" class="ax_default label">
                <div id="u222_div" class=""></div>
                <div id="u222_text" class="text ">
                  <p><span>关注微信公众号</span></p>
                </div>
              </div>

              <!-- Unnamed (垂直线) -->
              <div id="u223" class="ax_default line">
                <img id="u223_img" class="img " src="@/components/css/images/home/u221.svg">
                <div id="u223_text" class="text " style="display:none; visibility: hidden">
                  <p></p>
                </div>
              </div>

              <!-- Unnamed (图片 ) -->
              <div id="u224" class="ax_default image">
                <img id="u224_img" class="img " src="@/components/css/images/home/u224.png">
                <div id="u224_text" class="text " style="display:none; visibility: hidden">
                  <p></p>
                </div>
              </div>

              <!-- Unnamed (矩形) -->
              <div id="u225" class="ax_default label">
                <div id="u225_div" class=""></div>
                <div id="u225_text" class="text ">
                  <p><span>鲜花网小程序</span></p>
                </div>
              </div>

              <!-- Unnamed (形状) -->
              <div id="u226" class="ax_default _形状">
                <img id="u226_img" class="img " src="@/components/css/images/home/u226.svg">
                <div id="u226_text" class="text " style="display:none; visibility: hidden">
                  <p></p>
                </div>
              </div>

              <!-- Unnamed (矩形) -->
              <div id="u227" class="ax_default label">
                <div id="u227_div" class=""></div>
                <div id="u227_text" class="text ">
                  <p><span>关于我们</span></p>
                </div>
              </div>

              <!-- Unnamed (矩形) -->
              <div id="u228" class="ax_default label">
                <div id="u228_div" class=""></div>
                <div id="u228_text" class="text ">
                  <p><span>购物指南</span></p>
                </div>
              </div>

              <!-- Unnamed (矩形) -->
              <div id="u229" class="ax_default label">
                <div id="u229_div" class=""></div>
                <div id="u229_text" class="text ">
                  <p><span>退换货指南</span></p>
                </div>
              </div>

              <!-- Unnamed (矩形) -->
              <div id="u230" class="ax_default label">
                <div id="u230_div" class=""></div>
                <div id="u230_text" class="text ">
                  <p><span>花语大全</span></p>
                </div>
              </div>

              <!-- Unnamed (矩形) -->
              <div id="u231" class="ax_default label">
                <div id="u231_div" class=""></div>
                <div id="u231_text" class="text ">
                  <p><span>联系我们</span></p>
                </div>
              </div>

              <!-- Unnamed (垂直线) -->
              <div id="u232" class="ax_default line">
                <img id="u232_img" class="img " src="@/components/css/images/home/u232.svg">
                <div id="u232_text" class="text " style="display:none; visibility: hidden">
                  <p></p>
                </div>
              </div>

              <!-- Unnamed (垂直线) -->
              <div id="u233" class="ax_default line">
                <img id="u233_img" class="img " src="@/components/css/images/home/u232.svg">
                <div id="u233_text" class="text " style="display:none; visibility: hidden">
                  <p></p>
                </div>
              </div>

              <!-- Unnamed (垂直线) -->
              <div id="u234" class="ax_default line">
                <img id="u234_img" class="img " src="@/components/css/images/home/u232.svg">
                <div id="u234_text" class="text " style="display:none; visibility: hidden">
                  <p></p>
                </div>
              </div>

              <!-- Unnamed (垂直线) -->
              <div id="u235" class="ax_default line">
                <img id="u235_img" class="img " src="@/components/css/images/home/u232.svg">
                <div id="u235_text" class="text " style="display:none; visibility: hidden">
                  <p></p>
                </div>
              </div>

              <!-- Unnamed (矩形) -->
              <div id="u236" class="ax_default label">
                <div id="u236_div" class=""></div>
                <div id="u236_text" class="text ">
                  <p><span>企业团购</span></p>
                </div>
              </div>

              <!-- Unnamed (垂直线) -->
              <div id="u237" class="ax_default line">
                <img id="u237_img" class="img " src="@/components/css/images/home/u232.svg">
                <div id="u237_text" class="text " style="display:none; visibility: hidden">
                  <p></p>
                </div>
              </div>

              <!-- Unnamed (矩形) -->
              <div id="u238" class="ax_default label">
                <div id="u238_div" class=""></div>
                <div id="u238_text" class="text ">
                  <p><span>花店加盟</span></p>
                </div>
              </div>

              <!-- Unnamed (垂直线) -->
              <div id="u239" class="ax_default line">
                <img id="u239_img" class="img " src="@/components/css/images/home/u232.svg">
                <div id="u239_text" class="text " style="display:none; visibility: hidden">
                  <p></p>
                </div>
              </div>
            </div>
          </div>
        </div>
<!--        <div id="u216" style="display:none; visibility:hidden;"></div>-->
<!--                </div>-->
      </el-footer>

    </div>
    </body>
  </el-container>

</template>

<script>
export default {
  name: "CommonView",
  data() {
    return {
      isCollapse: false,
      isRouterAlive: true,
      optionInfo: 'close',
      isLoginPath: false,
      searchToName: '',

      accountId: 0,
      cartCount: 0,
    };
  },
  created() {
    this.selectAllCartByAccountId()
  },
  methods: {
    // 查询购物车数量
    selectAllCartByAccountId() {
      this.accountId = sessionStorage.getItem("accountId");
      if (this.accountId != null && this.accountId != 0) {
        this.$axios.get("/flowerCart/selectAllCartByAccountId", {
          params: {
            accountId: this.accountId,
            pageNum: 1,
            pageSize: 5,
          }
        }).then(res => {
          this.cartCount = res.data.data.total;
        })
      }
    },
    // 跳转到购物车页面(如果已在购物车页面则不会跳转而是刷新)
    toCart() {
      if (this.$route.path !== '/cart') {
        this.$router.push('/cart');
      } else {
        window.location.reload();
      }
    },
    handleClickToHome() {
      // 其他页面的点击操作,跳转到首页
      if (this.$route.path !== '/') {
        this.$router.push('/');
      }
    },
    handleClickToProduct() {
      // 跳转到产品列表
      if (this.$route.path === '/product') {
        sessionStorage.setItem("searchToName", this.searchToName);
        window.location.reload();
      } else {
        this.$router.push('/product');
        sessionStorage.setItem("searchToName", this.searchToName);
        window.location.reload();
      }
    },
    handleClickToCenter() {
      // 跳转到个人中心
      if (this.$route.path === '/center') {
        window.location.reload();
      } else {
        this.$router.push('/center');
      }
    },
    handleClickToPIM() {
      // 跳转到PIM
      if (this.$route.path === '/pim') {
        window.location.reload();
      } else {
        this.$router.push('/pim');
      }
    },
    handleClickToEvaluate() {
      // 跳转到评价
      if (this.$route.path === '/evaluate') {
        window.location.reload();
      } else {
        this.$router.push('/evaluate');
      }
    },
    handleClickSite() {
      // 跳转到地址
      if (this.$route.path === '/site') {
        window.location.reload();
      } else {
        this.$router.push('/site');
      }
    },
    toOrder(){
      if (this.$route.path === '/order') {
        window.location.reload();
      } else {
        this.$router.push('/order');
      }
    },
  },
}
</script>


